<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        // 下面我们来看下怎么用proxy去代理一个 Set结构
        let set = new Set();

        let proxy = new Proxy(set, {
            // 由于Set类型数据都是通过add方法去赋值的，而add方法其实是挂在Set.prototype上的一个函数，所以未来通过proxy.add()赋值时，肯定是读取add属性来赋值，所以会触发get()函数而不是这里的set()函数
            set() {

            },
            // 需要注意的是，Set类型的数据上的add、has等方法其实也是这些数据的属性，只是这些属性对应的值是方法。所以当我们通过proxy去调用add等方法的时候，需要使用bind函数改一下this指向，否则方法无法生效甚至会报错
            get(target, key) {
                console.log(target,key);
                let value = target[key];
                // 判断如果访问的属性是方法，那么就要返回更改了this指向的方法给他
                if (typeof value == "function"){
                    return value.bind(target);//target不就是数据本身么，这样就巧妙的改好了this指向
                }
                return value;
            }
        });
    </script>
</body>

</html>